<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无标题文档</title>
    <link href="css/style.css" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" href="kindeditor/themes/default/default.css"/>
    <script charset="utf-8" src="kindeditor/kindeditor.js"></script>
    <script charset="utf-8" src="kindeditor/lang/zh_CN.js"></script>
    <script language="JavaScript" src="js/jquery.js "></script>
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css">
    <script type="text/javascript" src="layui/layui.js"></script>

    <!--富文本编辑器-->
    <script type="text/javascript">
        var editor;
        KindEditor.ready(function (K) {
            editor = K.create('textarea[name="description"]', {
                uploadJson: '/product/kindEditorUpLoadFile',
                allowFileManager: true,
                allowImageUpload: true, //多图上传
                allowFileManager: true, //浏览图片空
                filterMode: false, //HTML特殊代码过滤
                afterBlur: function () {
                    this.sync();
                }, //编辑器失去焦点(blur)时执行的回调函数（将编辑器的HTML数据同步到textarea）
            });
            prettyPrint();
        });
    </script>

    <!--layui-->
    <script type="text/javascript">
        layui.use(['upload'], function () {
            var upload = layui.upload,
                $ = layui.$;
            upload.render({
                elem: '#test2'
                , url: '/product/layUiUpload'
                , multiple: true
                , accept: 'images'
                , exts: 'jpg|png|gif|bmp|jpeg'
                , size: 2048
                , before: function (obj) {
                    //预读本地文件示例，不支持ie8
                    obj.preview(function (index, file, result) {
                        $('#demo2').append('<img width="80px" src="'
                            + result + '" alt="' + file.name
                            + '" class="layui-upload-img upload-img">');
                    });
                }
                , done: function (res) {
                    $("#saveform").append("<input type='hidden' name='imgs' value='"
                        + res.imgurl + "'>");
                }
            });
        })
    </script>

    <!--级联回显-->
    <script language="JavaScript">
        function addCategoryOption(pid, level) {
            $.post("/product/findCategory", {"pid": pid}, function (result) {
                var options = "<option value=''>选择分类</option>";
                if (result.code == 200) {
                    var categoryList = result.object;
                    for (var i = 0; i < categoryList.length; i++) {
                        var category = categoryList[i];
                        options += "<option value='" + category.id + "'>" + category.name + "</option>";
                    }
                }
                if (level == "1") {
                    $("#categorylevel1id").html(options);
                }
                if (level == "2") {
                    $("#categorylevel2id").html(options);
                }
                if (level == "3") {
                    $("#categorylevel3id").html(options);
                }
            }, "json")
        }

        function showFirst() {
            addCategoryOption(0, 1);
        }

        window.onload = showFirst;
    </script>
</head>

<body>

<div class="place">
    <span>位置：</span>
    <ul class="placeul">
        <li><a href="#">首页</a></li>
        <li><a href="#">表单</a></li>
    </ul>
</div>

<div class="formbody">

    <div class="formtitle"><span>基本信息</span></div>

    <form action="/product/addSave" method="post" id="saveform">
        <ul class="forminfo">
            <li><label>商品名称</label><input name="name" type="text" class="dfinput"/></li>
            <li><label>单价</label><input name="price" type="text" class="dfinput"/></li>
            <li><label></label><cite>
                <select id="categorylevel1id" name="categorylevel1id" class="dfinput"
                        onchange="addCategoryOption(this.value,2)">
                    <option>一级分类</option>
                </select>
                <select id="categorylevel2id" name="categorylevel2id" class="dfinput"
                        onchange="addCategoryOption(this.value,3)">
                    <option>二级分类</option>
                </select>
                <select id="categorylevel3id" name="categorylevel3id" class="dfinput" onchange="">
                    <option>三级分类</option>
                </select>
            </cite>
            </li>
            <li><label>商品数量</label><input name="stock" type="text" class="dfinput"/></li>
            <li><label>商品描述</label><textarea name="description" cols="" rows="" class="textinput"></textarea></li>

            <div class="layui-upload">
                <button type="button" class="layui-btn" id="test2">图片上传</button>
                <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                    预览图：
                    <div class="layui-upload-list" id="demo2"></div>
                </blockquote>
            </div>
            <li><label>&nbsp;</label><input name="" type="submit" class="btn" value="确认保存"/></li>
        </ul>
    </form>

</div>
</body>
</html>
